<script setup lang="ts">
import type { Props } from './utils/types'
defineOptions({
    name: 'TransitionHeight'
})


defineProps<Props>()

</script>

<template>
    <Transition name="height-into">
        <slot></slot>
    </Transition>
</template>

<style lang="scss" scoped>
.height-into-enter-active,
.height-into-leave-active {
    transition: all 0.5s ease;
}

.height-into-enter-from,
.height-into-leave-to {
    height: 0 !important;
    margin-bottom: 0 !important;
}

.height-into-leave-from,
.height-into-enter-to {
    margin-bottom: 17px;
}
</style>
